<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>归档</title>
    <link rel="stylesheet" href="semantic/semantic.css">
    <link rel="stylesheet" href="static/css/custom.css">
    <link rel="stylesheet" href="static/layui/css/layui.css">
</head>
<body>
    <!--顶部导航-->
    <div class="ui attached secondary  stackable borderless menu ">
      <div class="left  menu">
          <a class="item brand">
            <img class="ui mini image" alt="网站图标" src="./static/image/icon.ico">
            <span class="m-text-title">大梁的博客</span>
          </a>
      </div>
      <div class="right  menu">
        <div class="item">
          <div class="ui icon input">
            <input type="text" placeholder="搜索...">
            <i class="search link icon"></i>
          </div>
        </div>
          <a class=" item m-item m-mobile-hide" href="index.html"><i class="home icon"></i>首页</a>
          <div class="ui simple dropdown item m-item  m-mobile-hide">
            <i class="idea icon"></i>分类
            <i class="dropdown icon"></i>
            <div class="menu">
              <a class="item" href="category.html">测测试分类</a>
              <a class="item" href="category.html">测试分类2</a>
              <a class="item" href="category.html">测试分类3</a>
            </div>
          </div>
          <a class="item m-item m-mobile-hide" href="tags.html"><i class="tags icon"></i>标签</a>
          <a class="item m-item m-mobile-hide" href="photos.html"><i class="images icon"></i>相册</a>
          <a class="active item m-item m-mobile-hide" href="archive.html"><i class="archive icon"></i>归档</a>
          <a class="item m-item m-mobile-hide" href="infocenter.html"><i class="rss square icon"></i>动态</a>
          <a class="item m-item m-mobile-hide" href="login.html"><i class="sign-in icon"></i>登录</a>
      </div>
    </div>
    <!--手机端-->
    <a href="#" title="缩放按钮" class="ui block icon button m-top-right m-mobile-show mobile-style">
      <i class="sidebar icon"></i>
    </a>
    <!--主要内容-->
    <div class="ui container vertical segment m-content" style="margin-left: 45%!important">
        <div class="ui container">
            <ul class="layui-timeline">
            <li class="layui-timeline-item">
              <i class="layui-icon layui-timeline-axis"></i>
              <div class="layui-timeline-content layui-text">
                <h3 class="layui-timeline-title">8月18日</h3>
                 <a href="index.html" class="m-text-color">《测试文章1》</a>
                 </br>
                 《测试文章2》
              </div>
            </li>
            <li class="layui-timeline-item">
              <i class="layui-icon layui-timeline-axis"></i>
              <div class="layui-timeline-content layui-text">
                <h3 class="layui-timeline-title">8月16日</h3>
                  《登高》
                </br>
                 《茅屋为秋风所破歌》
              </div>
            </li>
            <li class="layui-timeline-item">
              <i class="layui-icon layui-timeline-axis"></i>
              <div class="layui-timeline-content layui-text">
                <h3 class="layui-timeline-title">8月15日</h3>
                《登高》
              </br>
               《茅屋为秋风所破歌》
              </div>
            </li>
            <li class="layui-timeline-item">
              <i class="layui-icon layui-timeline-axis"></i>
              <div class="layui-timeline-content layui-text">
                <div class="layui-timeline-title">过去</div>
              </div>
            </li>
            <li class="layui-timeline-item">
              <i class="layui-icon layui-timeline-axis"></i>
              <div class="layui-timeline-content layui-text">
                <div class="layui-timeline-title">过去</div>
              </div>
            </li>
          </ul>  
        </div>
        <!--分页-->
        <div class="ui container" style="position: relative;" >
          <div class="ui pagination menu">
            <div class="item">上一页</div>
            <div class="active item">1</div>
            <div class="item">下一页</div>
          </div>
        </div>
    </div>  
    <!--底部-->
    <div class="ui  vertical footer segment">
      <div class="ui container vertical">
        <div class="ui stackable three column grid">
          <div class="center aligned column"><i class="copyright outline icon"></i>2022  &nbsp;<i class="user icon"></i>大梁</div>
          <div class="center aligned column">Powered by semantic-ui | Theme by Default </div>
          <div class="center aligned column"> ICPX备2020XXXX号</div>
        </div>
      </div>
    </div>
  <script src="./static/js/jquery-3.5.1.js"></script>
  <script src="./semantic/semantic.js"></script>
  <script type="text/javascript">
      $(function(){
          $('.ui .dropdown').dropdown();
          $(".mobile-style").click(function(){
          $(".m-item").toggleClass("m-mobile-hide");
      });
      });
  </script>    
</body>
</html>
